<template>
    <el-dialog v-model="show" title="查看预付款详情" width="35%" align-center @close="handleClose">

        <el-row :gutter="20">
            <el-col :span="8">
                <el-form-item label="所属公司：">
                    {{ props.initList.companyName }}
                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-form-item label="客户名称：">
                    {{ props.initList.customerName }}
                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-form-item label="预付款金额：">
                    ￥{{ props.initList.advanceAmount }}
                </el-form-item>
            </el-col>
        </el-row>
        <el-table :data="props.details" class="mt20" style="width: 100%">
            <el-table-column prop="createTime" label="操作日期" />
            <el-table-column prop="summary" label="摘要" />
            <el-table-column prop="amount" label="金额" />
            <el-table-column prop="createByName" label="操作人" />
        </el-table>
        <template #footer>
            <div class="dialog-footer">
                <el-button type="primary" @click="handleClose">确 定</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup lang="ts">
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const props = defineProps(['visible', 'initList', 'details']);
const emits = defineEmits(['submit', 'close']);

const show = ref(false);

watch(() => props.visible, async (newValue) => {
    show.value = newValue
    if (newValue) {
    }
}, { deep: true });

const tableData = [
    {
        date: '2016-05-03',
        name: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
    },
    {
        date: '2016-05-02',
        name: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
    },
    {
        date: '2016-05-04',
        name: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
    },
    {
        date: '2016-05-01',
        name: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
    },
]

const handleClose = () => {
    emits('close');
};

onMounted(() => {
})
</script>

<style lang="scss" scoped></style>